<template>
  <div class="step-box">
    <el-steps :active="step" finish-status="success" align-center>
      <el-step
        v-for="(item, index) in stepList"
        :key="index"
        :title="item.title"
      >
        <div slot="description">
          <p>{{ item.time }}</p>
          <p>{{ item.user }}</p>
          <p :class="{'danger-status': status === -1 || status === 2 || status === 3 || status === 6}">{{ item.status }}</p>
          <el-link v-if=" status === -1 && index ===2" type="primary" :underline="false" @click="showReject">查看原因</el-link>
        </div>
      </el-step>
    </el-steps>
  </div>
</template>

<script>
export default {
  name: 'Steps',
  props: {
    status: {
      type: Number,
      default: 0 // 审核状态  -1：驳回  0：待审核 1：通过  2：已撤销  3：违规下架 4：待发布 5：已上架  6：已下架
    },
    step: {
      type: Number,
      default: 1
    },
    stepList: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {
    }
  },

  methods: {
    showReject() {
      this.$emit('showReason')
    }
  }

}
</script>

<style lang="scss" scoped>
@import "@/components/Approve/step.scss";
</style>
